{% extends 'base.html' %}
{% block header %}

	<script type="text/javascript">
        $(function () {
            var goods_id = {{ goods.id }}
            var price = {{ goods.goods_price }}
            $('#add').click(function () {
                var count = parseInt($('#ammount').val())+1;
                $('#ammount').val(count);
                var totle = price * count;
                $('#totle').text(totle.toFixed(2))
            });
            $('#minus').click(function () {
                var count = parseInt($('#ammount').val());
                if(count>1){
                    var totle = price * (count-1);
                    $('#totle').text(totle.toFixed(2));
                    $('#ammount').val(count-1);
                }
            });
            var $add_x = $('#add_cart').offset().top;
            var $add_y = $('#add_cart').offset().left;

            var $to_x = $('#show_count').offset().top;
            var $to_y = $('#show_count').offset().left;

            $(".add_jump").css({'left':$add_y+80,'top':$add_x+10,'display':'block'})
            $('#add_cart').on("click", function () {
                add_jump();
                var count = $('#ammount').val();
                var url = '/cart/add_'+goods_id+'_'+count;
                $.get(url, function (data) {
                    $('#show_count').text(data.data);
                });

            });
            function add_jump(){
                $(".add_jump").stop().animate({
                    'left': $to_y+7,
                    'top': $to_x+7},
                    "fast", function() {
                        $(".add_jump").fadeOut('fast',function(){ });
                });
            }
        });

	</script>

{% endblock header %}

{% block body %}

	<div class="navbar_con">
		<div class="navbar clearfix">
			<div class="subnav_con fl">
				<h1>全部商品分类</h1>	
				<span></span>			
				<ul class="subnav">
					<li><a href="/goods/list1_1_1/" class="fruit">新鲜水果</a></li>
					<li><a href="/goods/list2_1_1/" class="seafood">海鲜水产</a></li>
					<li><a href="/goods/list3_1_1/" class="meet">猪牛羊肉</a></li>
					<li><a href="/goods/list4_1_1/" class="egg">禽类蛋品</a></li>
					<li><a href="/goods/list5_1_1/" class="vegetables">新鲜蔬菜</a></li>
					<li><a href="/goods/list6_1_1/" class="ice">速冻食品</a></li>
				</ul>
			</div>
			<ul class="navlist fl">
				<li><a href="/goods/index/">首页</a></li>
				<li class="interval">|</li>
				<li><a href="">手机生鲜</a></li>
				<li class="interval">|</li>
				<li><a href="">抽奖</a></li>
			</ul>
		</div>
	</div>

	<div class="breadcrumb">
		<a href="/goods/index/">全部分类</a>
		<span>></span>
		<a href="/goods/list{{ typeinfo.id }}_1_1">{{ typeinfo.type_name }}</a>
		<span>></span>
		<a href="#">商品详情</a>
	</div>

	<div class="goods_detail_con clearfix">
		<div class="goods_detail_pic fl"><img src="/static/{{ goods.goods_picture }}"></div>

		<div class="goods_detail_list fr">
			<h3>{{ goods.goods_name }}</h3>
			<p>{{ goods.goods_comment }}</p>
			<div class="prize_bar">
				<span class="show_pirze">¥<em>{{ goods.goods_price }}</em></span>
				<span class="show_unit">单  位：500g</span>
			</div>
			<div class="goods_num clearfix">
				<div class="num_name fl">数 量：</div>
				<div class="num_add fl">
					<input id="ammount" type="text" class="num_show fl" value="1">
					<a id="add" href="javascript:;" class="add fr">+</a>
					<a id="minus" href="javascript:;" class="minus fr">-</a>
				</div> 
			</div>
            <div class="total">总价：<em id="totle">{{ goods.goods_price }}</em><em>元</em></div>
			<div class="operate_btn">
				<a href="/cart/add_{{goods.id}}_1" class="buy_btn">立即购买</a>
				<a href="javascript:;" class="add_cart" id="add_cart">加入购物车</a>				
			</div>
		</div>
	</div>

	<div class="main_wrap clearfix">
		<div class="l_wrap fl clearfix">
			<div class="new_goods">
				<h3>新品推荐</h3>
				<ul>
                    {% for goods in new_goods %}
					<li>
						<a href="/goods/detail_{{ goods.id }}"><img src="/static/{{ goods.goods_picture }}"></a>
						<h4><a href="/goods/detail_{{ goods.id }}/">{{ goods.goods_name }}</a></h4>
						<div class="prize">￥{{ goods.goods_price }}</div>
					</li>
                    {% endfor %}
				</ul>
			</div>
		</div>

		<div class="r_wrap fr clearfix">
			<ul class="detail_tab clearfix">
				<li class="active">商品介绍</li>
				<li>评论</li>
			</ul>

			<div class="tab_content">
				<dl>
                    {{ goods.goods_tips }}
				</dl>
			</div>

		</div>
	</div>


	<div class="add_jump"></div>

{% endblock body %}
